<template>
  <view>
    <view class="goods-list">
		<!-- 列表项组件 -->
		<my-goods v-for="(goods, i) in list" :key="i" :goods="goods"></my-goods>
		<!-- 文字显示 -->
		<view v-if="finished">我也是有底线的！</view>
    </view>
  </view>
</template>

<script>
	export default {
		data() {
			return {
				queryObj:{
					query:'', // 关键字
					cid:'',  // 分类id
					pagenum:1, // 页码
					pagesize:10 ,// 每页数量
				},
				list:[], // 商品列表
				finished:false,  //是否结束
				loading:false // 是否加载中
			};
		},
		onLoad(options) {
			if(options.cid) this.queryObj.cid = options.cid
			if(options.query) this.queryObj.query = options.query
			// 获取数据列表
			this.getGoodList()
		},
		methods: {
			// 商品列表
			async getGoodList() {
				// 开启加载中
				this.loading = true // 开启了节流阀
				// 请求
				const {  data:res } = await uni.$http.get('/api/public/v1/goods/search',this.queryObj)
				// 错误处理
				if(res.meta.status !==200 ){
					this.loading = false  // 请求错误，也要关闭节流阀
					return uni.$showToast()
				}
				// 数据处理
				// 追加数据
				this.list = [...this.list,...res.message.goods]
				// 是否结束
				if(res.message.goods.length < this.queryObj.pagesize){
					// 结束了
					this.finished = true
				}else{
					// 没有结束， 页码+1
					this.queryObj.pagenum++
					// 关闭节流阀
					this.loading = false
				}
			}
		},
		// 上拉触底，加载更多数据
		onReachBottom() {
			// 是否能加载数据  （节流阀关闭、 依然还有数据）
			if(this.finished) return false   // 加载结束了
			if(this.loading) return false   // 处于数据加载中
			
			// 获取数据列表
			this.getGoodList()
		},
		// 下拉刷新操作
		async onPullDownRefresh(){
			// 置空 重新请求
			this.queryObj.pagenum = 1
			this.list = []
			this.finished = this.loading = false  
			// 获取数据
			await this.getGoodList()
			// 关闭下拉
			uni.stopPullDownRefresh()
		}
	}
</script>

<style lang="scss">

</style>
